/**
 * Created by Administrator on 2017/3/21.
 */
import React, {Component} from 'react';
import {
  Form, Input, Radio, Select, Icon,
  Upload, Tooltip, DatePicker, Button,
} from 'antd';
import {connect} from 'dva';
import ReactDataGrid from 'react-data-grid';
import moment from 'moment'
import request from '@/utils/request';
const FormItem = Form.Item;
const { TextArea } = Input;
const RadioGroup = Radio.Group;
const Option = Select.Option;
let originData=[
  {
    "address": "塔尔浪水源水",
    "cybhx": "0.58",
    "sd": "0.58",
    "rykjd": "0.58",
    "hzd": "0.58",
    "chw": "0.58",
    "ph": "0.58",
    "zyd": "0.58"
  },
  {
    "address": "塔尔浪出厂水",
    "cybhx": "0.58",
    "sd": "0.58",
    "rykjd": "0.58",
    "hzd": "0.58",
    "chw": "0.58",
    "ph": "0.58",
    "zyd": "0.58"
  },
  {
    "address": "一水厂水出厂",
    "cybhx": "0.58",
    "sd": "0.58",
    "rykjd": "0.58",
    "hzd": "0.58",
    "chw": "0.58",
    "ph": "0.58",
    "zyd": "0.58"
  },
  {
    "address": "二水厂",
    "cybhx": "0.58",
    "sd": "0.58",
    "rykjd": "0.58",
    "hzd": "0.58",
    "chw": "0.58",
    "ph": "0.58",
    "zyd": "0.58"
  },
  {
    "address": "绿园小区",
    "cybhx": "0.58",
    "sd": "0.58",
    "rykjd": "0.58",
    "hzd": "0.58",
    "chw": "0.58",
    "ph": "0.58",
    "zyd": "0.58"
  },
  {
    "address": "住建局",
    "cybhx": "0.58",
    "sd": "0.58",
    "rykjd": "0.58",
    "hzd": "0.58",
    "chw": "0.58",
    "ph": "0.58",
    "zyd": "0.58"
  },
  {
    "address": "农科所",
    "cybhx": "0.58",
    "sd": "0.58",
    "rykjd": "0.58",
    "hzd": "0.58",
    "chw": "0.58",
    "ph": "0.58",
    "zyd": "0.58"
  },
  {
    "address": "新区",
    "cybhx": "0.58",
    "sd": "0.58",
    "rykjd": "0.58",
    "hzd": "0.58",
    "chw": "0.58",
    "ph": "0.58",
    "zyd": "0.58"
  },
  {
    "address": "亚尔镇政府",
    "cybhx": "0.58",
    "sd": "0.58",
    "rykjd": "0.58",
    "hzd": "0.58",
    "chw": "0.58",
    "ph": "0.58",
    "zyd": "0.58"
  },
  {
    "address": "公司",
    "cybhx": "0.58",
    "sd": "0.58",
    "rykjd": "0.58",
    "hzd": "0.58",
    "chw": "0.58",
    "ph": "0.58",
    "zyd": "0.58"
  },
  {
    "address": "限值",
    "cybhx": "",
    "sd": "<=15",
    "rykjd": "无",
    "hzd": "出厂水≤1",
    "chw": "无异臭异味",
    "ph": "6.5--8.5",
    "zyd": "≤450"
  }
]

class AddPoliciesForm extends Component {
  constructor(props) {
    super(props);
    this.state = {
      users:[],
      originData:originData,
      parseData:[]
    };
  }

  componentDidMount() {
    const that=this;
    let arr=[{name:'采样编号',key:'cybhx',maxValue:'<=15'},{name:'色度',key:'sd',maxValue:'<=15'},
      {name:'肉眼可见物',key:'rykjd',maxValue:'无'},
      {name:'浑浊度',key:'hzd',maxValue:'出厂水≤1'},
      {name:'臭和味',key:'chw',maxValue:'无异臭异味'},
      {name:'PH',key:'ph',maxValue:'6.5--8.5'},
      {name:'总硬度mg/L',key:'zyd',maxValue:'≤450'}];
    let parseData=this.state.parseData
    for(let i=0;i<arr.length;i++){
      parseData[i]={name:arr[i].name,key:arr[i].key}
      for(let j=0;j<this.state.originData.length;j++){
        parseData[i][`${this.state.originData[j].address}`]=this.state.originData[j][arr[i].key]
      }
    }
    console.log('parseData',parseData)
    this.setState({parseData})
  }
  render() {
    const formItemLayoutWithLabel = {
      labelCol: {
        xs: {span: 24},
        sm: {span: 8},
      },
      wrapperCol: {
        xs: {span: 24},
        sm: {span: 14},
      }
    };

    const columns = [
      { key: "name", name: "" },
    ];
    for(let i=0;i<this.state.originData.length;i++){
      columns.push(  { key: this.state.originData[i].address, name: this.state.originData[i].address },)
    }
    console.log('columns',columns)
    return (
      <div>
        <Form onSubmit={this.handleSubmit}>
          <FormItem
            style={{display:'inline-block',width:'33%'}}
            {...formItemLayoutWithLabel}
            label={(
              <span>
               送检日期
            </span>
            )}
          >
           <span style={{fontWeight:'bold'}}>2021-06-18</span>
          </FormItem>
          <FormItem
            style={{display:'inline-block',width:'33%'}}
            {...formItemLayoutWithLabel}
            label={(
              <span>
               送检单位
            </span>
            )}
          >
            <span style={{fontWeight:'bold'}}>吐鲁番水质检测局</span>

          </FormItem>
          <FormItem
            style={{display:'inline-block',width:'33%'}}
            {...formItemLayoutWithLabel}
            label={(
              <span>
               报告编号
            </span>
            )}
          >
            <span style={{fontWeight:'bold'}}>001</span>

          </FormItem>
        </Form>
        <ReactDataGrid
          columns={columns}
          rowGetter={i => this.state.parseData[i]}
          rowsCount={this.state.parseData.length}
          minHeight={650}
        />
        <Form style={{marginTop:'10px'}} onSubmit={this.handleSubmit}>
          <FormItem
            style={{display:'inline-block',width:'33%'}}
            {...formItemLayoutWithLabel}
            label={(
              <span>
               填表人
            </span>
            )}
          >
            <span style={{fontWeight:'bold'}}>XXXX</span>

          </FormItem>
          <FormItem
            style={{display:'inline-block',width:'33%'}}
            {...formItemLayoutWithLabel}
            label={(
              <span>
               审核
            </span>
            )}
          >
            <span style={{fontWeight:'bold'}}>XXXX</span>

          </FormItem>
          <FormItem
            style={{display:'inline-block',width:'33%'}}
            {...formItemLayoutWithLabel}
            label={''}
          >
            <Button type={'primary'}>查看原文件</Button>
          </FormItem>
        </Form>
      </div>
    );
  }
}

const AddPoliciesFormWrap = Form.create()(AddPoliciesForm);
export default connect()(AddPoliciesFormWrap);


